<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>左侧Menu菜单</title>
    <link rel="stylesheet" href="font/iconfont.css">
    <link rel="stylesheet" href="css/style.css" media="screen" type="text/css"/>
</head>

<body>
<h3 class="title">菜单管理</h3>
<ul id="accordion" class="accordion">

</ul>
<script src="js/jquery-1.8.3.min.js"></script>
<script>
    $(function () {
        // 根据角色，显示不一样的菜单
        let role = 0;//sessionStorage.getItem("role");
        console.log("-------------------", role);
        if (role == 0) {// 管理员
            $(`
                    <li>
                         <div class="link"><i class="iconfont icon-2xitong"></i>类别管理<i class="iconfont icon-jiaoshi"></i>
                         </div>
                         <ul class="submenu">

                           <li><a href="javascript:void(0)" onclick="forward('booktype-add.html')" target="card">添加类别</a></li>
                           <li><a href="javascript:void(0)" onclick="forward('booktype-list.html')" target="card">类别列表</a></li>
                         </ul>
                    </li>
                    <li>
                         <div class="link"><i class="iconfont icon-2xitong"></i>图书管理<i class="iconfont icon-xuesheng"></i>
                         </div>
                         <ul class="submenu">

                           <li><a href="javascript:void(0)" onclick="forward('book-add.html')" target="card">添加图书</a></li>
                           <li><a href="javascript:void(0)" onclick="forward('book-list.html')" target="card">图书列表</a></li>
                         </ul>
                     </li>
                     <li>
                         <div class="link"><i class="iconfont icon-2xitong"></i>上架管理<i class="iconfont icon-kecheng"></i>
                         </div>
                         <ul class="submenu">

                           <li><a href="javascript:void(0)" onclick="forward('book-up-list.html')" target="card">已上架图书</a></li>
                           <li><a href="javascript:void(0)" onclick="forward('book-down-list.html')" target="card">未上架图书</a></li>
                         </ul>
                     </li>
                     <li>
                         <div class="link"><i class="iconfont icon-2xitong"></i>个人中心<i class="iconfont icon-username"></i>
                         </div>
                         <ul class="submenu">
                           <li><a href="javascript:void(0)" onclick="forward('user-info.html')" target="card">个人信息</a></li>
                           <li><a href="javascript:void(0)" onclick="forward('update-pwd.html')" target="card">修改密码</a></li>
                         </ul>
                     </li>
                    `).appendTo($("#accordion"))

        }
    })
</script>
<script src="js/index.js"></script>
<script>
    // 跳转界面
    function forward(href) {
        var frameid = parent.document.getElementById("card");
        frameid.src = href;
    }

</script>
</body>

</html>